
import loadingUrl from '@/assets/loading.svg'
import styles from './directive.module.less'

// 判断元素中是否存在某个元素
function isExists(el) {
  return el.querySelector("img[data-role=loading]")
}


// 创建image
function createLoadingImg() {
  const img = document.createElement("img")
  img.dataset.role = "loading"
  img.src = loadingUrl
  img.className = styles.loading
  return img
}

// 导出指令的配置对象
export default function (el, binging) {
  const curImg = isExists(el)
  if (binging.value) {
    if (!curImg) {
      const img = createLoadingImg()
      el.appendChild(img)
    }
  } else {
    if (curImg) {
      curImg.remove()
    }
  }
}